<!--
 * @Author: Bennty
 * @Date: 2024-11-25 15:12:57
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-11-26 16:21:20
 * @Description: 请填写简介
-->
<template>
    <el-dialog :model-value="props.visible" title="关联标签信息" width="35%"  @close="handleClose">
        <el-form label-width="auto">
            <el-form-item label="供应商名称：" align="right">{{ props.detail.companyName }}</el-form-item>
            <el-form-item label="供应商标签：" align="right">
                <div class="flex gap-2">
                    <el-tag v-for="(item,index) in labels" :key="index">
                        {{ item }}
                    </el-tag>
                </div>
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button  type="primary" @click="handleClose" >确 定</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
const props = defineProps<{
    visible: boolean,
    labels: string[],
    detail: any
}>();
const emits = defineEmits(['close']);
const displayedLabels = ref<string[]>([]);

const handleClose = () => {
    emits('close');
};
</script>

<style scoped>

</style>